<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link th:href="@{/css/style.css}" rel="stylesheet" type="text/css" />
<script type="text/javascript" th:src="@{/js/jquery.js}"></script>
<script type="text/javascript" th:src="@{/laydate/laydate.js}"></script>
<style type="text/css">
  #date{
    padding-right: 0;
    height: 32px;
    line-height: 32px;
  }
</style>
</head>

<body>
<div class="place"> <span>位置：</span>
  <ul class="placeul">
    <li>系统管理</li>
    <li>用户管理</li>
    <li>添加</li>
  </ul>
</div>
<div class="formbody">
  <div class="formtitle"><span>员工信息</span></div>
  <form id="registerForm" th:action="@{/sys/users/addUsers}" method="post">
  <input type="hidden" name="statusId" value="1"/>
  <ul class="forminfo">
    <li>
      <label>员工姓名</label>
      <input id="uname" name="uname" type="text" class="dfinput" />
      <i>必填，不能超过30个字符</i>
    </li>
    <li>
      <label>密码</label>
      <input id="upassword" name="upassword" type="password" class="dfinput" />
      <i>必填，不能超过30个字符</i>
    </li>
    <li>
      <label>性别</label>
      <cite>
          <input name="sex" type="radio" value="1" checked="checked" />男
          &nbsp;&nbsp;&nbsp;&nbsp;
          <input name="sex" type="radio" value="2" />女
      </cite>
    </li>
    <li>
      <label>联系方式</label>
      <input id="utelephone" name="utelephone" type="text" value="" class="dfinput" />
      <i>必填，不能超过30个字符</i>
    </li>
    <li>
      <label>出生年月</label>
      <input id="date" name="date" class="dfinput laydate-icon demo-input" placeholder="请选择日期" />
    </li>
    <li>
      <label>所属部门</label>
      <select id="deptId" name="deptId" class="dfselect" onchange="getJobs(this.value)">
        <option value="">请选择部门</option>
        <option th:each="d:${session.dlist}" th:value="${d.deptId}" th:text="${d.deptName}">研发</option>
      </select>
    </li>
    <li>
      <label>职位</label>
      <select id="jobId" name="jobId" class="dfselect">
        <option value="">请选择</option>
      </select>
    </li>
    <li>
      <label>&nbsp;</label>
      <input onclick="addUsers()" type="button" class="btn" value="确认保存"/>
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      <input name="" type="button" class="btn" value="返回"  onclick="window.history.go(-1);"/>
    </li>
  </ul>
  </form>
</div>
<script type="text/javascript">
  //执行一个laydate实例
  laydate.render({
    elem:'#date'
  });
  //域内容发生变化的事件
  function getJobs(num) {
    //异步请求
    $.get("/erp/ajaxJobs",{"did":num},function (data) {
      // JSON.parse(data);  data--->object
      //清空内容
      $("select[name=jobId]").html("")
      var options = "<option value=''>请选择职位</option>";
      $.each(data, function (i, e) {
        options += "<option value='" + e.jobId + "'>" + e.jobName + "</option>";
      });
      $("select[name=jobId]").append(options);
    },"json");
  }
</script>

<!--注册用户表单验证-->
<script>
  $(function () {
    $("#uname").blur(function () {
      ckuname();
    });
    $("#upassword").blur(function () {
      ckupassword();
    });
    $("#utelephone").blur(function () {
      ckutelephone();
    });
    $("#date").blur(function () {
      ckdate();
    });
    $("#deptId").blur(function () {
      ckdeptId();
    });
    $("#jobId").blur(function () {
      ckjobId();
    });
  });
  function ckuname() {
    if($("#uname").val()==""){
      return false;
    }else{
      return true;
    }
  }
  function ckupassword() {
    if($("#upassword").val()==""){
      return false;
    }else{
      return true;
    }
  }
  function ckutelephone() {
    if($("#utelephone").val()==""){
      return false;
    }else{
      return true;
    }
  }
  function ckdate() {
    if($("#date").val()==""){
      return false;
    }else{
      return true;
    }
  }
  function ckdeptId() {
    if($("#deptId").val()==""){
      return false;
    }else{
      return true;
    }
  }
  function ckjobId() {
    if($("#jobId").val()==""){
      return false;
    }else{
      return true;
    }
  }
  function addUsers() {
    if(ckuname()&&ckupassword()&&ckutelephone()&&ckdate()&&ckdeptId()&&ckjobId()){
      $("#registerForm").submit();
    }else{
      confirm("添加用户失败！");
    }
  }
</script>
</body>
</html>
